import React, { useState, FC } from 'react';
import _ from 'lodash';
import { Table } from '@/components';
import { TableUtils } from '@/utils';
import { Modal, Form, Button, Space } from 'antd';
import { router } from 'umi';
const { getColumns } = TableUtils;
const { confirm } = Modal;
interface ListProps {}

const List: FC<ListProps> = (props: any) => {
  const {
    spinning,
    fields,
    pagination,
    list,
    onChange,
    rowSelection,
    confirmLoading,
    formFields,
  }: any = props;
  const [form] = Form.useForm();
  const paginationProps = {
    ...pagination,
    showTotal: (tc: number) => `总共 ${tc} 条`,
  };
  function toDetail(record: any) {
    router.push(`/order/orderManage/orderList/handle/detail/${record.id}`);
  }
  const extraColumns = [
    {
      key: 'operate',
      name: '操作',
      width: 100,
      fixed: 'right',
      render: (text: any, record: any) => {
        return (
          <Space>
            <Button
              type="link"
              onClick={() => {
                toDetail(record);
              }}
              style={{ padding: 0 }}
            >
              查看
            </Button>
          </Space>
        );
      },
    },
  ];
  const tableProps = {
    scroll: { x: 1200 },
    rowKey: 'id',
    columns: getColumns(fields)
      .extend(extraColumns)
      .values(),
    loading: spinning,
    dataSource: list,
    pagination: paginationProps,
    style: {
      marginTop: 20,
    },
    onChange,
    rowSelection,
  };

  return (
    <>
      <Table {...tableProps} />
    </>
  );
};

export default List;
